<template>
  <div class="filter">
    <div class="form">
      <el-form ref="form" inline v-bind="$attrs">
        <el-form-item label="名称">
          
        </el-form-item>
      </el-form>
    </div>
    <div class="hanle">
      <el-button type="primary" @click="submit">搜索</el-button>
      <el-button @click="reset">重置</el-button>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import type { FormInstance } from 'element-plus'

defineProps<{
  modelValue: any
}>()

const emit = defineEmits<{
  (e: 'submit'): void,
  (e: 'reset'): void,
  (e: 'update:modelValue', value: any): void,

}>()

const form = ref<FormInstance>()

const submit = () => {
  emit('update:modelValue')
  emit('submit')
}
const reset = () => {
  form.value?.resetFields()
  emit('reset')
}
</script>

<style scoped lang="scss">
.filter {
  display: flex;
  .hanle {
    margin-left: 20px;
  }
}
</style>